<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>

<%@ include file="/static/include/common.inc"%>
<title>青州市名卡管理系统</title>
<link rel="shortcut icon"
	href="https://github.com/shuaijunlan/Autumn-Framework/raw/master/favicon.ico"
	type="image/x-icon" />
<link rel="stylesheet" href="static/admin/css/layui.css">
<link rel="stylesheet" href="static/admin/css/main.css" media="all">
<script src="static/js/jquery-1.11.2.js"></script>
<style type="text/css">
.layui-laypage-banner {
	position: absolute;
	left: calc(50% - 200px);
}
</style>
</head>
<body>
	<ul class="layui-tab-title">
		<li class="layui-this">图片管理</li>
	</ul>
	<div class="layui-tab-content">
		<div class="layui-tab-item layui-show" style="margin: 10px">
			<div class="buttonTable">
				<blockquote class="layui-elem-quote mylog-info-tit">
					<div class="layui-inline">
						<form class="layui-form" id="userSearchForm">
							<div class="layui-input-inline" style="width: 110px;">
								<select id="searchTerm">
									<option value=""></option>
									<option value="img_id">id</option>
									<option value="img_name">图片名</option>
									<option value="img_type">图片类型</option>
								</select>
							</div>
							<div class="layui-input-inline" style="width: 145px;">
								<input type="text" name="searchContent" value=""
									placeholder="请输入关键字" class="layui-input search_input">
							</div>
						</form>
					</div>
					<div class="layui-inline">
						<button id="search" class="layui-btn">查询</button>
					</div>
					<button id="upload" class="layui-btn" style="float: right;">添加</button>
				</blockquote>
			</div>
			<table class="layui-table"
				lay-data="{ url:'admin/banner/load.do', cache:false,page: true, id:'imgTable'}"
				lay-filter="tablename">
				<thead>
					<tr>
						<th lay-data="{type:'checkbox', fixed: 'left'}"></th>
						<th lay-data="{field:'imgName', }">图片名</th>
						<th lay-data="{field:'imgId',  }">ID</th>
						<th lay-data="{field:'imaType', }">类型</th>
						<th lay-data="{field:'imgUrl', }">地址</th>
						<th
							lay-data="{fixed: 'right', width:356, align:'center', toolbar: '#barDemo'}"></th>
					</tr>
				</thead>
			</table>

			<script type="text/html" id="barDemo">
           		<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
           		<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
			</script>
		</div>
	</div>
	<script src="static/layui_v2.2.3/layui.js" charset="utf-8"></script>
	<script>
		$.ajaxSetup({
			cache : false
		});
		layui.use('table', function() {
			var table = layui.table;
			//监听表格复选框选择
			table.on('checkbox(tablename)', function(obj) {
				console.log(obj)
			});

			//监听工具条
			table.on('tool(tablename)', function(obj) {
				var data = obj.data;
				if (obj.event === 'detail') {
					layer.open({
						type : 2,
						title : '图片查看',
						shadeClose : false,
						move : false,
						type : 2,
						area : [ '700px', '450px' ],
						maxmin : true,
						closeBtn : 0,
						content : 'admin/banner/view.do?imgId=' + data.imgId,
						btn : [ '关闭' ],
						yes : function() {
							layer.closeAll();
						}
					});
				} else if (obj.event === 'edit') {
					layer.open({
						type : 2,
						title : '图片修改',
						shadeClose : false,
						move : false,
						type : 2,
						area : [ '700px', '450px' ],
						maxmin : true,
						closeBtn : 0,
						content : 'admin/banner/edit.do?imgId=' + data.imgId,
						btn : [ '更新', '关闭' ],
						yes : function(index) {
							var form = window["layui-layer-iframe" + index]
									.getForm();
							var url = "admin/banner/update.do?imgId="
									+ data.imgId + "&imgName=" + data.imgName;
							$.ajax({
								url : url,
								data : form,
								type : 'post',
								processData : false,
								contentType : false,
								error : function(data) {
									console.log(data);
								},
								success : function(data) {
									if (data.code == 1) {
										alert(data.message);
									}
								}
							});
							layer.closeAll();
						},
						btn2 : function() {
							layer.closeAll();
						}
					});
				}
			});

			$('.buttonTable #upload').on(
					'click',
					function() {
						layer.open({
							type : 2,
							title : '图片上传',
							shadeClose : false,
							move : false,
							type : 2,
							area : [ '700px', '450px' ],
							maxmin : true,
							closeBtn : 1,
							content : 'admin/banner/toUpload.do',
							btn : [ '上传' ],
							yes : function(index) {
								var form = window["layui-layer-iframe" + index]
										.getForm();
								var url = "admin/banner/upload.do;"
								$.ajax({
									url : url,
									data : form,
									type : 'post',
									processData : false,
									contentType : false,
									error : function(data) {
										console.log(data);
									},
									success : function(data) {
										if (data.code == 1) {
											alert(data.message);
										}
									}
								});
								layer.closeAll();
							}
						});

					})

			$('.buttonTable #search').on('click', function() {
				var type = $("#searchTerm option:selected").val();
				var content = $(".search_input").val();
				table.reload('imgTable', {
					page : {
						curr : 1
					//重新从第 1 页开始
					},
					where : {
						type : type,
						content : content
					}
				});

			});
		});
	</script>
</body>
</html>